.lf-graph {
  background-color: var(--el-bg-color);

  .lf-control {
    background-color: var(--el-bg-color);
    border: var(--el-border);
    border-radius: 0;
    box-shadow: var(--el-box-shadow-lighter);
  }

  .lf-element-text {
    color: var(--el-text-color-regular);
  }

  .lf-line-text {
    rect {
      stroke: var(--el-color-primary);
    }
  }

  .lf-node-content {

    circle {
      stroke: var(--el-color-primary);
    }

    rect {
      stroke: var(--el-color-primary);
    }

    polygon {
      stroke: var(--el-color-primary);
    }

    path {
      stroke: var(--el-color-primary);
      fill: var(--el-color-primary);
    }
  }

  .lf-edge {
    marker {
      path {
        fill: var(--el-color-primary);
        stroke: var(--el-color-primary);
      }
    }

    polyline {
      stroke: var(--el-color-primary);
    }
  }

  .lf-multiple-select{
    border-color: var(--el-color-warning);
    box-shadow: var(--el-box-shadow-lighter);
  }
 
  .lf-anchor{
    line{
      stroke: var(--el-color-primary);
    }
  }
  
}



html.dark {
  .lf-control-item {
    &:hover {
      background-color: var(--item-hover-bg);
    }
  }

  .lf-control-zoomOut {
    background-image: url();
  }

  .lf-control-zoomIn {
    background-image: url();
  }

  .lf-control-fit {
    background-image: url();
  }

  .lf-control-undo {
    background-image: url();
  }

  .lf-control-redo {
    background-image: url();
  }

  .lf-menu {
    background: var(--el-bg-color-overlay);
    border: 1px solid var(color-light);
    box-shadow: var(--el-box-shadow-light);

    .lf-menu-item {
      color: var(--el-text-color-regular);

      &:hover {
        background-color: var(--el-fill-color-light);
        color: var(--el-color-primary);
      }
    }
  }

  .lf-text-input {
    background: var(--el-bg-color-overlay);
    color: var(--el-text-color-regular);
    border: 1px solid var(--el-border-color-light);
    box-shadow: var(--el-box-shadow-light);
  }

  .lf-node-content {
    rect {
      fill: var(--el-bg-color-overlay);
    }

    circle {
      fill: var(--el-bg-color-overlay);
    }

    polygon {
      fill: var(--el-bg-color-overlay);
    }
  }

  .lf-line-text {
    rect {
      fill: var(--el-bg-color-overlay);
    }
  }
}